Motion >> Repos - motion-next.git/blob

   1 <md-dialog class="project-dialog" aria-label="New Project">
   2   <form name="projectForm" class="md-inline-form" novalidate>
   3     <md-toolbar class="md-accent md-hue-2">
   4       <div
   5         class="md-toolbar-tools"
   6         layout="row"
   7         layout-align="space-between center"
   8       >
   9         <span class="title">{{vm.title | translate}}</span>
  10         <md-button class="md-icon-button" ng-click="vm.closeDialog()">
  11           <md-icon
  12             md-font-icon="icon-close"
  13             aria-label="Close dialog"
  14           ></md-icon>
  15         </md-button>
  16       </div>
  17     </md-toolbar>
  18
  19     <md-dialog-content ms-scroll>
  20       <div class="error-list">
  21         <div
  22           ng-repeat="error in vm.errors"
  23           class="error"
  24           layout="row"
  25           layout-align="space-between center"
  26         >
  27           <div>
  28             <span class="message">{{error.message}}</span>
  29             <span class="type">({{error.type}})</span>
  30           </div>
  31           <md-button class="md-icon-button">
  32             <md-icon
  33               md-font-icon="icon-alert-box"
  34               aria-label="alert error"
  35               class="s16"
  36             ></md-icon>
  37           </md-button>
  38         </div>
  39       </div>
  40       <md-input-container class="md-block">
  41         <label translate="CALLYSQUARE.NAME">Name</label>
  42         <input
  43           name="name"
  44           ng-model="vm.project.name"
  45           required
  46           md-autofocus
  47           ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
  48           ng-disabled="!vm.newProject"
  49         />
  50         <div
  51           ng-messages="projectForm.name.$error"
  52           ng-show="projectForm.name.$touched"
  53           role="alert"
  54         >
  55           <div ng-message="required">
  56             <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
  57               >Name field is required</span
  58             >
  59           </div>
  60           <div ng-message="pattern">
  61             <span
  62               translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
  63               translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
  64               >Name must be valid pattern
  65             </span>
  66           </div>
  67         </div>
  68       </md-input-container>
  69       <md-input-container class="md-block">
  70         <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
  71         <input name="description" ng-model="vm.project.description" />
  72         <div
  73           ng-messages="projectForm.description.$error"
  74           ng-show="projectForm.description.$touched"
  75           role="alert"
  76         >
  77           <div ng-message="required">
  78             <span translate="CALLYSQUARE.ERRORS.DESCRIPTION_REQUIRED"
  79               >Description field is required</span
  80             >
  81           </div>
  82         </div>
  83       </md-input-container>
  84       <md-input-container ng-if="vm.openFromEditor" class="md-block"
  85         ><!-- Added to check if I'm opening the dialog directly from the square editor -->
  86         <md-switch
  87           ng-model="vm.newWindow"
  88           aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
  89           ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
  90         ></md-switch>
  91       </md-input-container>
  92       <div class="error-list">
  93         <div
  94           ng-repeat="error in vm.errors"
  95           class="error"
  96           layout="row"
  97           layout-align="space-between center"
  98         >
  99           <div>
 100             <span class="message">{{error.message}}</span>
 101             <span class="type">({{error.type}})</span>
 102           </div>
 103           <md-button class="md-icon-button">
 104             <md-icon
 105               md-font-icon="icon-alert-box"
 106               aria-label="alert error"
 107               class="s16"
 108             ></md-icon>
 109           </md-button>
 110         </div>
 111       </div>
 112     </md-dialog-content>
 113
 114     <md-dialog-actions layout="row" layout-align="space-between center">
 115       <div
 116         layout="row"
 117         layout-align="start center"
 118         ng-if="vm.crudPermissions.canEdit"
 119       >
 120         <md-button
 121           type="submit"
 122           ng-if="!vm.newProject"
 123           ng-click="vm.saveProject()"
 124           class="send-button md-accent md-raised"
 125           ng-disabled="projectForm.$invalid || projectForm.$pristine"
 126           aria-label="SAVE"
 127           translate="CALLYSQUARE.SAVE"
 128           translate-attr-aria-label="CALLYSQUARE.SAVE"
 129         >
 130           SAVE
 131         </md-button>
 132
 133         <md-button
 134           type="submit"
 135           ng-if="vm.newProject"
 136           ng-click="vm.addNewProject()"
 137           class="send-button md-accent md-raised"
 138           ng-disabled="projectForm.$invalid || projectForm.$pristine"
 139           aria-label="ADD"
 140           translate="CALLYSQUARE.ADD_PROJECT"
 141           translate-attr-aria-label="CALLYSQUARE.ADD_PROJECT"
 142         >
 143           ADD PROJECT
 144         </md-button>
 145       </div>
 146       <div layout="row">
 147         <md-button
 148           class="md-icon-button"
 149           ng-if="vm.crudPermissions.canDelete && !vm.newProject"
 150           ng-click="vm.deleteProject($event)"
 151           aria-label="DELETE"
 152           translate
 153           translate-attr-aria-label="CALLYSQUARE.DELETE"
 154         >
 155           <md-icon md-font-icon="icon-delete"></md-icon>
 156           <md-tooltip
 157             ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
 158           >
 159         </md-button>
 160       </div>
 161     </md-dialog-actions>
 162   </form>
 163 </md-dialog>